<template>
  <div style="display:inline-block;padding:0 6px;">
    <Dropdown trigger="click" @on-click="selectUser">
      <a href="javascript:void(0)">
        <Icon :size="22" type="record" color="red"/>
        <Icon type="arrow-down-b"></Icon>
      </a>
      <DropdownMenu slot="list">
        <DropdownItem v-for="(item, index) in themeList" :key="index" :name="item">
          <Row type="flex" justify="center">
            <span><Avatar size="small" src="https://i.loli.net/2017/08/21/599a521472424.jpg" /></span>
            <span>{{item.name}}</span>
          </Row>
        </DropdownItem>
      </DropdownMenu>
    </Dropdown>
  </div>
</template>

<script>
  export default {
    name: 'userSelect',
    data () {
      return {
        selectList:[],
        themeList: [
          {
            name: '张三',
            menu: '#495060',
            element: '#2d8cf0'
          },
          {
            name: '李四',
            menu: '#495060',
            element: '#00a854'
          },
          {
            name: '王五',
            menu: '#495060',
            element: '#e96500'
          },
          {
            name: '马六',
            menu: '#495060',
            element: '#e43e31'
          },
          {
            name: '测试',
            menu: '#495060',
            element: '#2d8cf0'
          },
          {
            name: '前台',
            menu: '#495060',
            element: '#00a854'
          },
          {
            name: '程序猿',
            menu: '#495060',
            element: '#e96500'
          },
          {
            name: '攻城狮',
            menu: '#495060',
            element: '#e43e31'
          }
        ]
      };
    },
    methods:{
      selectUser(item){
        console.info(item)
      }
    }
  };
</script>

